<script setup lang="ts">
import { ref } from 'vue';
import  { useLogin } from '../../stores/loginStore'
import { useRouter } from 'vue-router';
const router = useRouter()
const username = ref('')
const password = ref('')

const store = useLogin()

const onSubmit = (value:any) => {
    console.log(value);
    store.handleLogin(value.username,value.password)
    router.push('/main')
}
const onReg = () => {
    router.push('/reg')
}

</script>

<template>
    <Headers visible title="登录" ></Headers>
    <van-form @submit.enter="onSubmit">
        <van-cell-group inset>
            <van-field 
            v-model="username" 
            name="username" 
            label="用户名" 
            placeholder="用户名"
            :rules="[{ required: true, message: '请填写用户名' }]" />
            <van-field 
            v-model="password" 
            type="password" 
            name="password" 
            label="密码" 
            placeholder="密码"
            :rules="[{ required: true, message: '请填写密码' }]" />
        </van-cell-group>
        <div style="margin: 16px;">
            <van-button round block type="primary" native-type="submit">
                提交
            </van-button>
        </div>
        <div style="margin: 16px;">
            <van-button round block type="primary" @click="onReg">
                注册
            </van-button>
        </div>
    </van-form>
</template>